<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        *{
            margin: 10px auto;
            padding: 0;
        }
        body,html{
            width: 100%;
        }
        #header{
            width: 24%;
            height: 93px;
            background: #f4f4f4;
            display: flex;
            /*justify-content: flex-end;*/
            align-items: center;

        }
        #header>img{
            width: 25px;
            height: 30px;
        }
        #main{
            width: 24%;
            height:270px;
            /*border: 1px solid red;*/
            display: flex;
        }
        #main img{
            width:100%;
            height: 180px;
            display: flex;
        }
        #footer{
            /*background-color: gray;*/
            height: 100px;
            width: 24%;
            justify-content: space-between;
            align-items: center;
            margin: 0 auto;
            display: flex;
        }
        #footer div{
            width: 24%;
            justify-content:center;
            /*align-items: center;*/
            display:inline-block;
            height: 74px;
            /*border: 1px solid red;*/
        }
        #footer div img{
            display: flex;
        }
        #footer div span{
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 12px;

        }
    </style>
</head>
<body>
<div id="header">
    <div><span>小米商城</span></div>
    <div>
        <img src="img/img1.png" alt=""/>
        <img src="img/img2.png" alt=""/>
    </div>
</div>
<div id="main">
    <img src="img/img3.png" alt=""/>
</div>
<div id="footer">
    <div class="img1"><img src="img/img4.png" alt=""/><span>全部商品</span> </div>
    <div><img src="img/img5.png" alt=""/>
        <span>搜索</span></div>
    <div><img src="img/img6.png" alt=""/>
        <span>小米社区</span></div>
    <div><img src="img/img7.png" alt=""/>
        <span>客户端</span></div>
</div>
</body>
</html>